import React, { PureComponent } from 'react';
import { connect } from 'dva';
import { DATA_ENTRY, FormGroup, FormItemLayout } from '@/src/components';

@connect(({ userM: user }) => ({ user }))
export default class MyModal extends PureComponent {
  state = {
    pageSize: 10,
    isPublic: false,
    isData: false,
    isFlag: false,
    id: '',
    institution: [],
    currentUser: {},
  };

  FormGroupRefList = React.createRef();

  componentDidMount() {
    // 父组件对本组件的引用
    this.props.onRef(this);
    this.setDisable();
    this.props.dispatch({
      type: 'couponPoolDefinitionM/getUserInfo',
      payload: {
        userId: localStorage.getItem('antd-pro-userId'),
      },
      callback: (res) => {
        this.setState({
          currentUser: res,
        });
      },
    });
  }

  setDisable = () => {
    const { defaultData, isEdit } = this.props.data;
    if (isEdit) {
      const { institutions } = defaultData;
      const institution = [];
      if (defaultData.type == 'user') {
        this.setState({
          isFlag: true,
          isData: true,
          isPublic: false,
        });
      } else if (defaultData.type == 'tenant') {
        this.setState({
          isFlag: false,
          isData: true,
          isPublic: true,
        });
      } else {
        this.setState({
          isFlag: false,
          isData: false,
          isPublic: true,
        });
      }

      institutions.map((item) => {
        institution.push(item.id);
      });

      this.setState({
        institution,
      });
    }
  };

  // 券池类型点击
  changeValue = (value) => {
    const form = this.FormGroupRefList.current?.formRef.current;
    const { setFieldsValue } = form;
    const { currentUser } = this.state;
    const institution = currentUser.institutionModels;
    const datas = this.changeCode(institution);
    // 用户级
    if (value == 'user') {
      setFieldsValue({
        share: false,
        approval: null,
      });
      if (form.getFieldValue('share') == false) {
        setFieldsValue({
          share: false,
          approval: null,
          institutionId1: [],
        });
      }

      this.setState({
        isFlag: true,
        isData: true,
        isPublic: false,
      });
    } else if (value == 'tenant') {
      // 公司级
      this.setState({
        isFlag: false,
        isData: true,
        isPublic: true,
      });
      setFieldsValue({
        approval: true,
        share: null,
        institutionId1: [],
      });
    } else {
      // 部门级
      this.setState({
        isFlag: false,
        isData: false,
        isPublic: true,
      });
      setFieldsValue({
        approval: true,
        share: null,
        institutionId1: datas,
      });
    }
  };

  changeCode = (e) => {
    const arrs = [];
    if (e && e.length) {
      e.map((item) => {
        arrs.push(item.id);
      });
    }
    return arrs;
  };

  // 是否公开点击
  handelChange = (value) => {
    const { setFieldsValue, getFieldValue } = this.FormGroupRefList.current?.formRef.current;
    const { currentUser } = this.state;
    const institution = currentUser.institutionModels;
    const datas = this.changeCode(institution);
    if (getFieldValue('type1') == 'user') {
      if (value == true) {
        setFieldsValue({
          institutionId1: datas,
        });
      } else {
        setFieldsValue({
          institutionId1: [],
        });
      }
    }
  };

  Formrender = () => {
    const { mangement, treeDatas } = this.props;
    const qgqx = [
      { key: '是', value: true },
      { key: '否', value: false },
    ];
    const { defaultData, selectGroup, isEdit } = this.props.data;
    const approvalChaldren = [
      { key: '是', value: true },
      { key: '否', value: false },
    ];
    const { assetClass, type } = selectGroup;
    const type2 = [{ value: '用户级', code: 'user' }];
    const useType = mangement ? type : type2;
    return (
      <div>
        <FormGroup
          onRef={(ref) => {
            this.FormGroupRefList.current = ref;
          }}
          autoLayout={false}
          rowNumber={2}
          dataSource={[
            {
              dataIndex: 'name1',
              title: '券池名称',
              type: DATA_ENTRY.INPUT,
              initialValue: isEdit ? defaultData.name : '',
              rules: [
                { required: true, message: `请输入` },
                { max: 50, message: '最大不可超过50个字符' },
              ],
              formItemLayout: FormItemLayout,
              max: 50,
              span: 24,
            },
            {
              dataIndex: 'assetClass1',
              title: '资产类别',
              type: DATA_ENTRY.SELECT,
              dataSource: assetClass?.map((item) => ({
                title: item.value,
                value: item.code,
              })),
              initialValue: isEdit ? defaultData.assetClass : '',
              rules: [{ required: true, message: '请选择' }],
              span: 24,
              formItemLayout: FormItemLayout,
              positionBody: true,
              disabled: isEdit,
            },
            {
              dataIndex: 'type1',
              title: '券池类型',
              type: DATA_ENTRY.SELECT,
              dataSource: useType?.map((item) => ({
                title: item.value,
                value: item.code,
              })),
              initialValue: isEdit ? defaultData.type : '',
              rules: [{ required: true, message: '请选择' }],
              span: 24,
              formItemLayout: FormItemLayout,
              positionBody: true,
              onChange: this.changeValue,
            },
            {
              dataIndex: 'approval',
              title: '是否审批',
              type: DATA_ENTRY.SELECT,
              dataSource: approvalChaldren?.map((item) => ({
                title: item.key,
                value: item.value,
              })),
              initialValue: isEdit ? defaultData.approval : null,
              span: 24,
              formItemLayout: FormItemLayout,
              positionBody: true,
              disabled: this.state.isFlag,
            },
            {
              dataIndex: 'institutionId1',
              title: '关联部门',
              type: DATA_ENTRY.TREESELECT,
              dataSource: treeDatas,
              initialValue: isEdit ? this.state.institution : [],
              positionBody: true,
              span: 24,
              formItemLayout: FormItemLayout,
              disabled: this.state.isData,
              isMultiple: true,
              maxTagCount: 0,
            },
            {
              dataIndex: 'share',
              title: '是否公开',
              type: DATA_ENTRY.SELECT,
              dataSource: qgqx?.map((item) => ({
                title: item.key,
                value: item.value,
              })),
              initialValue: isEdit ? defaultData.share : null,
              span: 24,
              formItemLayout: FormItemLayout,
              positionBody: true,
              disabled: this.state.isPublic,
              onChange: this.handelChange,
            },
          ]}
        />
      </div>
    );
  };

  render() {
    return (
      <div>
        <div>{this.Formrender()}</div>
      </div>
    );
  }
}
